import React, {useEffect, useRef} from 'react';
import * as echarts from 'echarts';
import './index.scss'
import Bar from "@/components/Bar";
// 1．看官方文档把echarts加入项目
// 如何在react获取dom -> useRef
// 在什么地方获取dom节点-> useEffect
// 2．不抽离定制化的参数先把最小化的demo跑起来
// 3．按照需求，哪些参数需要自定义抽象出来

const Home = () => {
    return (
        <div>
            {/* 渲染Bar组件*/}
            <Bar
                title='主流框架使用满意度'
                xData={['react', 'vue', 'angular']}
                yData={[30, 40, 50]}
                style={{width: 500, height: 600}}/>
            <Bar title='主流框架使用满意度'
                 xData={['react', 'vue', 'angular']}
                 yData={[40, 80, 60]}
                 style={{width: 500, height: 200}}/>
        </div>
    )
};

export default Home;